
$(function () {
    vm.changeSelect();
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        laydate.render({
            elem: '#outStartTime',
            range:true,
            done:function(value, date, endDate){
                if(value){
                    var spliTime = value.split(' - ');
                    vm.q.beginExpirationDate   = spliTime[0];
                    vm.q.endExpirationDate  = spliTime[1];
                }else{
                    vm.q.beginExpirationDate = null;
                    vm.q.endExpirationDate = null;
                }
            }
        });
        laydate.render({
            elem: '#regStartTime',
            range:true,
            done:function(value, date, endDate){
                if(value){
                    var spliTime = value.split(' - ');
                    vm.q.beginRegistrationDate  = spliTime[0];
                    vm.q.endRegistrationDate  = spliTime[1];
                }else{
                    vm.q.beginRegistrationDate  = null;
                    vm.q.endRegistrationDate  = null;
                }
            }
        });
        laydate.render({
            elem: '#creTime',
            range:true,
            done:function(value, date, endDate){
                if(value){
                    var spliTime = value.split(' - ');
                    vm.q.beginDate   = spliTime[0];
                    vm.q.endDate  = spliTime[1];
                }else{
                    vm.q.beginDate   = null;
                    vm.q.endDate  = null;
                }
            }
        });
     });
    $('#bootstrap-table')
        .bootstrapTable(
            {
                method : 'post', // 服务器数据的请求方式 get or post
                url : baseURL + 'aliyunDomain/findAliyunDomainInfoPage', // 服务器数据的加载地址
                showRefresh : true,
                showToggle : true,
                showColumns : true,
                //showExport :true,
                sortable: true,
                sortName:"userId",// 排序列名称
                sortOrder: "desc",
                iconSize : 'outline',
                toolbar : '#exampleToolbar',
                striped : true, // 设置为true会有隔行变色效果
                dataType : "json", // 服务器返回的数据类型
                pagination : true, // 设置为true会在底部显示分页条
                // queryParamsType : "limit",
                // //设置为limit则会发送符合RESTFull格式的参数
                singleSelect : false, // 设置为true将禁止多选
                // contentType : "application/x-www-form-urlencoded",
                // //发送到服务器的数据编码类型
                pageSize : 10, // 如果设置了分页，每页数据条数
                pageNumber : 1, // 如果设置了分布，首页页码
                // search : true, // 是否显示搜索框
                //showColumns : false, // 是否显示内容下拉框（选择显示的列）
                sidePagination : "server", // 设置在哪里进行分页，可选值为"client" 或者
                // "server"
                queryParams : function(params) {
                    //console.log(params)
                    return {
                        // 说明：传入后台的参数包括offset开始索引，limit步长，sort排序列，order：desc或者,以及所有列的键值对
                        page:(params.offset/params.limit) + 1 +'',
                        limit:params.limit + '',
                        domainName:vm.q.domainName,
                        beginDate:vm.q.beginDate,
                        endDate:vm.q.endDate,
                        beginExpirationDate:vm.q.beginExpirationDate,
                        endExpirationDate:vm.q.endExpirationDate,
                        beginRegistrationDate:vm.q.beginRegistrationDate,
                        endRegistrationDate:vm.q.endRegistrationDate,
                        domainStatus:vm.q.domainStatus,
                        domainType:vm.q.domainType,
                        domainAuditStatus:vm.q.domainAuditStatus,
                        expirationDateStatus:vm.q.expirationDateStatus,
                        platformName:vm.q.platformName,
                        registrantType:vm.q.registrantType
                    };
                },
                complete:function () {
                    $('[data-toggle="tooltip"]').tooltip({
                        html:true
                    });
                },
                onLoadSuccess:function () {
                    $('[data-toggle="tooltip"]').tooltip({
                        html:true
                    });
                },
               columns : [{
                        checkbox : true
                    },
                   {
                       field : 'domainName',
                       align:'center',
                       title : '域名名称'
                   },
                   {
                       field : 'instanceId',
                       align:'center',
                       title : '实例编号'
                   },
                   {
                       field : 'platformName',
                       align:'center',
                       title : '平台名称'
                   },
                  {
                      // /** 域名状态。枚举值范围：1 急需续费；2 急需赎回；3 正常 */
                       field : 'domainStatus',
                       align:'center',
                       title : '域名状态',
                       formatter:function (value,row,index) {
                           var bgColor = ["red","blue","green"];
                           var e = '';
                           if(value == 1){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[0]+"'>急需续费</span>";
                           }else if(value == 2){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[1]+"'>急需赎回</span>";
                           }else{
                               e = "<span class='tdStyle' style='background-color:"+bgColor[2]+"'>正常</span>";
                           }
                           return e;
                       }
                   },
                   {
                       // /** 域名类型。枚举值范围：New gTLD； gTLD；ccTLD */
                       field : 'domainType',
                       align:'center',
                       title : '域名类型'
                   },
                   {
                       field : 'premium',
                       align:'center',
                       title : '是否是溢价域名',
                       formatter:function (value,row,index) {
                           var bgColor = ["red","green"];
                           var e;
                           if(value == true){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[1]+"'>是</span>";
                           }else if(value == false){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[0]+"'>否</span>";
                           }else {
                               e = "-";
                           }
                           return e;
                       }
                   },
                   {
                       // /** 域名实名认证状态。枚举值范围： FAILED 实名认证失败；SUCCEED 实名认证成功；NONAUDIT 未实名认证；AUDITING 审核中 */
                       field : 'domainAuditStatus',
                       align:'center',
                       title : '认证状态',
                       formatter:function (value,row,index) {
                           var bgColor = ["red","green","black","blue"];
                           var e;
                           if(value == "FAILED"){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[0]+"'>失败</span>";
                           }else if(value == "SUCCEED"){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[1]+"'>成功</span>";
                           }else if(value == "NONAUDIT"){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[2]+"'>未认证</span>";
                           }else{
                               e = "<span class='tdStyle' style='background-color:"+bgColor[3]+"'>审核中</span>";
                           }
                           return e;
                       }
                   },
                   {
                       //  /** 域名过期状态，枚举值范围：1 域名未过期；2 域名已过期 */
                       field : 'expirationDateStatus',
                       align:'center',
                       title : '过期状态',
                       formatter:function (value,row,index) {
                           var bgColor = ["red","green"];
                           var e;
                           if(value == "1"){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[1]+"'>未过期</span>";
                           }else{
                               e = "<span class='tdStyle' style='background-color:"+bgColor[0]+"'>已过期</span>";
                           }
                           return e;
                       }
                   },
                   {
                       // /** 域名注册类型，枚举值范围：1 个人；2 企业 */
                       field : 'registrantType',
                       align:'center',
                       title : '注册类型',
                       formatter:function (value,row,index) {
                           var bgColor = ["red","green"];
                           var e;
                           if(value == "1"){
                               e = "<span class='tdStyle' style='background-color:"+bgColor[1]+"'>个人</span>";
                           }else{
                               e = "<span class='tdStyle' style='background-color:"+bgColor[0]+"'>企业</span>";
                           }
                           return e;
                       }
                   },
                   {
                       field : 'registrationDate',
                       align:'center',
                       width:330,
                       title : '时间',
                       formatter:function (value,row,index) {
                           //console.log(row);
                           var regTime = "<div class='timeBox'><h4>注册时间:</h4><div>"+ row.registrationDate+ "</div></div>";
                           var outTime = "<div class='timeBox'><h4>到期时间:</h4><div>"+row.expirationDate+"</div></div>";
                           var createTime = "<div class='timeBox'><h4>创建时间:</h4><div>"+row.createTime+"</div></div>";
                           return regTime + outTime + createTime;
                       }
                   },
                  {
                        title : '操作',
                        field : 'id',
                        width:200,
                        align : 'center',
                        formatter : function(
                            value, row,
                            index){
                            //console.log(value);
                            // return '<div class="btn btn-warning" onclick="info('+value+')">解析</div>';
                            return '<a class="btn btn-warning" href="dnsRecored.html?id='+row.id+'">域名解析</a>';
                        }
                    }]
              });
 });
var types = 2;
var vm = new Vue({
    el:'#rrapp',
    data:{
        q:{
            domainName :null,
            beginDate:null,
            endDate:null,
            beginExpirationDate:null,
            endExpirationDate:null,
            beginRegistrationDate:null,
            endRegistrationDate:null,
            domainStatus:null,
            domainType:null,
            domainAuditStatus:null,
            expirationDateStatus:null,
            platformName:null,
            registrantType:null
        }
   },
    methods: {
        query: function () {
            vm.reload();
        },
        reset:function () {

            $('#domainStatus').selectpicker('val','');
            $('#domainStatus').selectpicker('refresh');

            $('#domainType').selectpicker('val','');
            $('#domainType').selectpicker('refresh');

            $('#domainAuditStatus').selectpicker('val','');
            $('#domainAuditStatus').selectpicker('refresh');

            $('#expirationDateStatus').selectpicker('val','');
            $('#expirationDateStatus').selectpicker('refresh');

            $('#registrantType').selectpicker('val','');
            $('#registrantType').selectpicker('refresh');

            $("#creTime").val(null);
            $("#regStartTime").val(null);
            $("#outStartTime").val(null);
            vm.q.domainName = null;
            vm.q.beginDate = null;
            vm.q.endDate = null;
            vm.q.beginExpirationDate = null;
            vm.q.endExpirationDate = null;
            vm.q.beginRegistrationDate = null;
            vm.q.endRegistrationDate = null;
            vm.q.domainStatus = null;
            vm.q.domainType = null;
            vm.q.domainAuditStatus = null;
            vm.q.expirationDateStatus = null;
            vm.q.platformName = null;
            vm.q.registrantType = null;
            vm.reload();
        },
        changeSelect:function () {
            $('#domainStatus ').on('changed.bs.select',function(e){
                // console.log($(this).val());
                vm.q.domainStatus = $(this).val();
            });
            $('#domainType ').on('changed.bs.select',function(e){
                // console.log($(this).val());
                vm.q.domainType  = $(this).val();
            });
            $('#domainAuditStatus ').on('changed.bs.select',function(e){
                // console.log($(this).val());
                vm.q.domainAuditStatus  = $(this).val();
            });
            $('#expirationDateStatus').on('changed.bs.select',function(e){
                // console.log($(this).val());
                vm.q.expirationDateStatus   = $(this).val();
            });
            $('#registrantType ').on('changed.bs.select',function(e){
                // console.log($(this).val());
                vm.q.registrantType  = $(this).val();
            });
        },
         reload: function (event) {
            vm.showList = 1;
            var opt = {
                url: baseURL + 'aliyunDomain/findAliyunDomainInfoPage',
                query:{
                    limit : '10',
                    page : '0',
                    domainName:vm.q.domainName,
                    beginDate:vm.q.beginDate,
                    endDate:vm.q.endDate,
                    beginExpirationDate:vm.q.beginExpirationDate,
                    endExpirationDate:vm.q.endExpirationDate,
                    beginRegistrationDate:vm.q.beginRegistrationDate,
                    endRegistrationDate:vm.q.endRegistrationDate,
                    domainStatus:vm.q.domainStatus,
                    domainType:vm.q.domainType,
                    domainAuditStatus:vm.q.domainAuditStatus,
                    expirationDateStatus:vm.q.expirationDateStatus,
                    platformName:vm.q.platformName,
                    registrantType:vm.q.registrantType
                }
            };
            $('#bootstrap-table').bootstrapTable('refresh',
                opt);
        }
    }
});